<template>
  <div class="header-panel">
    <!--<el-breadcrumb separator="/">-->
      <!--<el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>-->
      <!--<el-breadcrumb-item >{{ $route.meta.title }}</el-breadcrumb-item>-->
    <!--</el-breadcrumb>-->
    <span style="margin-right: 15px">{{ $route.meta.title }}</span>
    <div class="left-warp">
      <slot name="left"/>
    </div>
    <slot name="right" />

  </div>
</template>

<script>
export default {
  name: 'UHeader'
}
</script>

<style scoped >
  .header-panel{
    display: flex;
    width: 100%;
    height: 48px;
    align-items: center;
    padding: 0px 5px;
    justify-content: center;
    border-bottom: 1px solid #e4e7ed;
  }

  .left-warp{
    height:100%;
    flex: 1;
    justify-content: start;
    align-items: center;
    display: flex;
    width: 100%;
    height: 100%;
  }
</style>
